{% extends "base.html" %}{% load i18n crm_tags %}
{% block title %}{% translate "Call time" %}{% endblock %}
{% block content %}
<div class="page-head">
  <div>
    <h1>{% if is_me %}{% translate "Your call time" %}{% else %}{% blocktranslate trimmed with name=person.display_name %}Call time: {{ name }}{% endblocktranslate %}{% endif %}</h1>
    <p>{% translate "Calls and minutes week by week, from the minutes entered on each call." %}</p>
  </div>
  {% if not is_me %}<div class="actions"><a class="btn btn-quiet" href="{% url 'call_time' %}">{% translate "Whole team" %}</a></div>{% endif %}
</div>

<div class="figures">
  <div><span class="n">{{ this_week.n }}</span><span class="l">{% translate "Calls this week" %}</span></div>
  <div><span class="n">{{ this_week.minutes }}</span><span class="l">{% translate "Minutes this week" %}</span></div>
  <div><span class="n">{{ month.n }}</span><span class="l">{% translate "Calls this month" %}</span></div>
  <div><span class="n">{{ month.minutes }}</span><span class="l">{% translate "Minutes this month" %}</span></div>
</div>

<section class="panel">
  <div class="panel-head"><h2>{% translate "Minutes per week" %}</h2><span class="muted small">{% translate "Last 12 weeks" %}</span></div>
  <div class="bars" role="img" aria-label="{% translate 'Minutes per week' %}">
    {% for w in weeks %}<span class="bar{% if not w.minutes %} zero{% endif %}" style="height:{{ w.height }}%" title="{{ w.start|date:'j M' }}: {{ w.minutes }}"></span>{% endfor %}
  </div>
  <div class="bars-axis"><span>{{ weeks.0.start|date:"j M" }}</span><span>{% translate "This week" %}</span></div>
</section>

<div class="split-even" style="margin-top:20px">
  <div class="table-wrap">
    <table>
      <thead><tr><th>{% translate "Week of" %}</th><th class="right">{% translate "Calls" %}</th><th class="right">{% translate "Spoke with them" %}</th><th class="right">{% translate "Minutes" %}</th></tr></thead>
      <tbody>
      {% for w in weeks reversed %}
        <tr{% if not w.n %} class="absent"{% endif %}><td class="nowrap">{{ w.start|date:"j M" }}</td><td class="right num">{{ w.n }}</td><td class="right num">{{ w.spoke }}</td><td class="right num"><strong>{{ w.minutes }}</strong></td></tr>
      {% endfor %}
      </tbody>
    </table>
  </div>
  <section class="panel">
    <div class="panel-head"><h2>{% translate "Calls this week" %}</h2></div>
    {% if recent %}
    <ul class="rows">
      {% for c in recent %}
      <li>
        <div class="grow"><a class="title" href="{{ c.contact.get_absolute_url }}">{{ c.contact.name }}</a>
          <div class="meta">{{ c.get_purpose_display }}, {{ c.get_outcome_display|lower }}</div></div>
        <span class="num small">{% if c.duration_minutes %}{% blocktranslate trimmed with m=c.duration_minutes %}{{ m }} min{% endblocktranslate %}{% else %}—{% endif %}</span>
        <span class="muted small nowrap">{{ c.called_at|when }}</span>
      </li>
      {% endfor %}
    </ul>
    {% else %}<p class="muted small">{% translate "No calls logged this week yet." %}</p>{% endif %}
  </section>
</div>
{% endblock %}